<template>
  <section class="flex-center">
    <div>
      <img class="imgSty"
           src="@/static/images/404.png"
           alt="logo" />
      <div class="image-slot">
        <div class="tips-1">S o r r y... 页面没有找到</div>
        <div class="tips-2">你所寻找的网页已移动或丢失了，点击<el-button type="text"
                     class="btnSty"
                     @click="handleClick">返回</el-button>至上一页进行操作
        </div>
      </div>
    </div>
  </section>
</template>

<script>
let lastPath
export default {
  name: "errorView",
  data () {
    return {
    }
  },
  beforeRouteEnter (to, from, next) {
    next(vm => {
      lastPath = from?.path;
    })
    // next()
  },
  methods: {
    handleClick () {
      if (lastPath && lastPath.includes("board")) {
        this.$router.go(-2);
      } else {
        this.$router.back();
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.flex-center {
  background-color: var(--prev-bg-color);
  height: 100vh;
  display: flex;
  justify-content: center;
  padding-top: 20vh;
}
.imgSty {
  width: 480px;
  height: 220px;
}
.image-slot {
  padding: 20px;
}
.tips-1 {
  font-size: 32px;
  font-family: Source Han Sans CN;
  font-weight: 600;
  color: #da7716;
}
.tips-2 {
  font-size: 12px;
  font-family: Source Han Sans CN;
  font-weight: 600;
  color: #000000;
  line-height: 22px;
  padding: 20px 10px;
}
.btnSty {
  color: #0092ff !important;
  font-weight: 600;
}
</style>
